$(function(){
    $(".header").load("./header.html",function(){
  
    })

    $(".bigimg").on("mouseenter",function(){
        $(this).find("span").show()
        $(this).next().show()
        $(this).on("mousemove",function(e){
            var X=e.pageX
            var Y=e.pageY
            var left=X-$(this).offset().left-$(this).find("span").width()/2
            var top=Y-$(this).offset().top-$(this).find("span").height()/2
           if(left<0) left=0
           if(left>$(this).width()-$(this).find("span").width()) left=$(this).width()-$(this).find("span").width() 
           if(top<0) top=0
           if(top>$(this).height()-$(this).find("span").height()) top=$(this).height()-$(this).find("span").height()
           $(this).find("span").css({"left":left,"top":top})
           $(this).next().find("img").css({"left":-2*left,"top":-2*top})
        })
    })
    $(".bigimg").on("mouseleave",function(){
        $(this).find("span").hide()
        $(this).next().hide()
    })
    $(".smallimg").on("mouseenter","img",function(){
       $(this).parent().addClass("imgborder_red").siblings().removeClass("imgborder_red")
       $(".bigimg_right img").attr("src",$(this).attr("src"))
        $(".bigimg img").attr("src",$(this).attr("src"))
    })
    
    $(".fenxiang1").on("mouseenter","span",function(){
         $(this).css("color","red")

    })
    $(".fenxiang1").on("mouseleave","span",function(){
        $(this).css("color","")
   })

   $(".shopimglist span").on("click",function(){
     
    if($(this).index()==1){
           $(".shopimgtab").hide()
         
       }else{
        $(".shopimgtab").show()
       }
   })
   var top=$(".shopimglist").offset().top
   $(window).scroll(function(){
       if($(window).scrollTop()>top){
           $(".shopimglist").css({position:"fixed",left:340,top:0})
           $(".shopimgtab").css({paddingTop:46})
       }else{
        $(".shopimglist").css({position:"static"})
        $(".shopimgtab").css({paddingTop:0})
       }
     
    })
 
    $(".add b").next().on("click",function(){
        var n=$(".add b").html()
        n++
        $(".add b").html(n)
        $(".sum span").eq(0).html(n)
        var price=$(".left2_4 a span").html()
        console.log(price,n)
        $(".sum span").eq(1).html((price*n).toFixed(2))
    })
    $(".add b").prev().on("click",function(){
        var n=$(".add b").html()
        if(n<=1) return
        n--
        $(".add b").html(n)
         $(".sum span").eq(0).html(n)
        var price=$(".left2_4 a span").html()
        $(".sum span").eq(1).html((price*n).toFixed(2))
    })
       
    if (window.location.search.indexOf("?") != -1) {
        var gid = window.location.search.split("?")[1].split("=")[1];

        $.ajax({
            url: "./api/getinfo",
            headers: {
                token: localStorage.getItem("token")
            },
            data: {
                gid
            },
            dataType: "jsonp", //重点1
            jsonp: "cb1", //后台接受的变量名称
            jsonpCallback: "fn" //后台返回回调函数的名称
        }).then(function (res) {
             console.log(res)
             var html1=`  <span data-info=${JSON.stringify(res)} ></span>
             <img src="${res.img}" alt="">`
            $(".left1 .bigimg").html(html1)
            var html2=` <img src="${res.img}" alt="">`
            $(".bigimg_right").html(html2)
            var html3=""
            res.smalling.forEach(function(item){
              
               html3+=`<div class="imgborder">
                            <img src="${item}" alt="">
                        </div>`
            })
            $(".smallimg").html(html3)
            var html4=`》1件<br>￥${res.price}`
            $(".title2").html(html4)
            var html5=`${res.price}`
            $(".left2_4 a span").html(html5)
            $(".sum span").eq(1).html(html5)
            
        })
    }

    $(".buy a").eq(1).on("click",function(){
         var data=$(".bigimg span").data("info")
         delete(data.smalling);
         data.num = $(".add b").html()
         if(!JSON.parse(localStorage.getItem("user"))){
             alert("请先登录")
             return
             
         }
         data.uid = JSON.parse(localStorage.getItem("user")).uId
         console.log(data)
        $.ajax({
            url: "./api/addCart",
            type: "post",
            headers: {
                token: localStorage.getItem("token")
            },
            data: data,
        }).then(function (res) {
            alert(res.msg)
        })
    })
   
   
       


})